<template>
	<div>
		<div class="forms" v-for="item in forms.fields" :key="item.__config__.formId">
			<vDivider :text="item.__config__.label" :position="item.__config__.position" v-if="item.__config__.tag === 'el-divider'"></vDivider>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'span'">
				{{ item.__config__.defaultValue }}
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-input'" :inline="item.type === 'textarea'">
				<vInput v-if="item.type === 'textarea'" type="textarea" v-model="item.__config__.defaultValue" :readonly="item.readonly" :disabled="item.disabled" :placeholder="item.placeholder" :maxlength="item.maxlength" :rows="item.autosize" :showLimit="item['show-word-limit']">
					<template #prepend>
						{{ item.__slot__ ? item.__slot__.prepend : "" }}
					</template>
					<template #append>
						{{ item.__slot__ ? item.__slot__.append : "" }}
					</template>
				</vInput>
				<vInput v-else-if="item['show-password']" type="password" v-model="item.__config__.defaultValue" :readonly="item.readonly" :disabled="item.disabled" :placeholder="item.placeholder" :maxlength="item.maxlength" :clearable="item.clearable">
					<template #prepend>
						{{ item.__slot__ ? item.__slot__.prepend : "" }}
					</template>
					<template #append>
						{{ item.__slot__ ? item.__slot__.append : "" }}
					</template>
				</vInput>
				<vInput v-else type="text" v-model="item.__config__.defaultValue" :readonly="item.readonly" :disabled="item.disabled" :placeholder="item.placeholder" :maxlength="item.maxlength" :clearable="item.clearable">
					<template #prepend>
						{{ item.__slot__ ? item.__slot__.prepend : "" }}
					</template>
					<template #append>
						{{ item.__slot__ ? item.__slot__.append : "" }}
					</template>
				</vInput>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-switch'">
				<vSwitch v-model="item.__config__.defaultValue" :activeColor="item['active-color']" :inactiveColor="item['inactive-color']">
					<template #inactiveText>
						{{ item["inactive-text"] ? item["inactive-text"] : "" }}
					</template>
					<template #activeText>
						{{ item["active-text"] ? item["active-text"] : "" }}
					</template>
				</vSwitch>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-checkbox-group'">
				<vCheckbox v-model="item.__config__.defaultValue" :options="item.__slot__.options" :disabled="item.disabled" :optionType="item.__config__.optionType" :size="item.size"></vCheckbox>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-radio-group'">
				<vRadio v-model="item.__config__.defaultValue" :options="item.__slot__.options" :disabled="item.disabled" :optionType="item.__config__.optionType" :size="item.size"></vRadio>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-slider'">
				<vSlider v-model="item.__config__.defaultValue" :disabled="item.disabled" :min="item.min" :max="item.max" :step="item.step" :range="item.range"></vSlider>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-rate'">
				<vRate v-model="item.__config__.defaultValue" :disabled="item.disabled" :max="item.max" :half="item['allow-half']" :showText="item['show-text']" :showScore="item['show-score']"></vRate>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-date-picker'">
				<vDatePicker v-if="item.type === 'date'" v-model="item.__config__.defaultValue" :disabled="item.disabled" :clearable="item.clearable" :format="item['value-format'] || item.format" :readonly="item.disabled" type="date" :placeholder="item.placeholder"></vDatePicker>
				<vDatePicker
					v-else-if="item.type === 'daterange'"
					v-model="item.__config__.defaultValue"
					:disabled="item.disabled"
					:clearable="item.clearable"
					:format="item['value-format'] || item.format"
					:readonly="item.disabled"
					:placeholder="item.placeholder"
					:rangeSeparator="item['range-separator']"
					:startPlaceholder="item['start-placeholder']"
					:endPlaceholder="item['end-placeholder']"
					type="daterange"
				></vDatePicker>
				<vDatePicker
					v-else-if="item.type === 'datetimerange'"
					v-model="item.__config__.defaultValue"
					:disabled="item.disabled"
					:clearable="item.clearable"
					:format="item['value-format'] || item.format"
					:readonly="item.disabled"
					:placeholder="item.placeholder"
					:rangeSeparator="item['range-separator']"
					:startPlaceholder="item['start-placeholder']"
					:endPlaceholder="item['end-placeholder']"
					type="datetimerange"
				></vDatePicker>
				<vDatePicker v-else-if="item.type === 'datetime'" v-model="item.__config__.defaultValue" :disabled="item.disabled" :clearable="item.clearable" :format="item['value-format'] || item.format" :readonly="item.disabled" type="datetime" :placeholder="item.placeholder"></vDatePicker>
				<vDatePicker v-else-if="item.type === 'month'" v-model="item.__config__.defaultValue" :disabled="item.disabled" :clearable="item.clearable" :format="item['value-format'] || item.format" :readonly="item.disabled" type="month" :placeholder="item.placeholder"></vDatePicker>
				<vDatePicker v-else-if="item.type === 'year'" v-model="item.__config__.defaultValue" :disabled="item.disabled" :clearable="item.clearable" :format="item['value-format'] || item.format" :readonly="item.disabled" type="year" :placeholder="item.placeholder"></vDatePicker>
				<vDatePicker v-else-if="item.type === 'week'" v-model="item.__config__.defaultValue" :disabled="item.disabled" :clearable="item.clearable" :format="item['value-format'] || item.format" :readonly="item.disabled" type="week" :placeholder="item.placeholder"></vDatePicker>
			</vFormItem>

			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-time-picker'">
				<vTimePicker v-if="item['is-range']" v-model="item.__config__.defaultValue" :disabled="item.disabled" :type="'timeRange'" :format="item['value-format'] || item.format" :clearable="item.clearable" :startPlaceholder="item['start-placeholder']" :endPlaceholder="item['end-placeholder']" :separator="item['range-separator']"></vTimePicker>

				<vTimePicker v-else v-model="item.__config__.defaultValue" :disabled="item.disabled" :placeholder="item.placeholder" :type="'time'" :selectable="item['picker-options']" :format="item['value-format'] || item.format" :clearable="item.clearable"></vTimePicker>
			</vFormItem>

			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-input-number'">
				<vNumberBox v-model="item.__config__.defaultValue" :disabled="item.disabled" :min="item.min" :max="item.max" :step="item.step" :strictly="item['step-strictly']" :position="item['controls-position']" :precision="item.precision"></vNumberBox>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-color-picker'">
				<vColorPicker v-model="item.__config__.defaultValue" :colorFormat="item['color-format']" :measure="item.size" :disabled="item.disabled"></vColorPicker>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-select'">
				<vSelect v-model="item.__config__.defaultValue" :disabled="item.disabled" :list="item.__slot__.options" :placeholder="item.placeholder" :multiple="item.multiple" :filterable="item.filterable"></vSelect>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'el-cascader'">
				<vCascadeSelect v-model="item.__config__.defaultValue" :disabled="item.disabled" :list="item.options" :placeholder="item.placeholder" :filterable="item.filterable" :separator="item.separator"></vCascadeSelect>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'image-upload'">
				<vUpload v-model="item.__config__.defaultValue" :disabled="item.disabled" :showTip="item.__config__.showTip" :max="item.__config__.limit" @change="onUploadcardType" type="image" :fileSize="item.__config__.fileSize"></vUpload>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'video-upload'">
				<vUpload v-model="item.__config__.defaultValue" :disabled="item.disabled" :showTip="item.__config__.showTip" :max="1" @change="onUploadvideo" type="video"></vUpload>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'file-upload'">
				<vUpload v-model="item.__config__.defaultValue" :disabled="item.disabled" :showTip="item.__config__.showTip" :max="item.__config__.limit" @change="onUploadfile" type="file"></vUpload>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'fortress-region'">
				<vRegion v-model="item.__config__.defaultValue" :disabled="item.disabled"></vRegion>
			</vFormItem>
			<vFormItem :label="item.__config__.label" v-else-if="item.__config__.tag === 'phone_sms'">
				<vGetCode v-model="item.__config__.defaultValue" @change="changeCode" :second="item.intervalSecond" :validMinutes="item.validityMinute" @time="getTime"></vGetCode>
			</vFormItem>
		</div>
		<div class="footer">
			<button class="mini-btn" type="default" size="mini" @click="cancel">取消</button>
			<button class="mini-btn button" type="primary" size="mini" @click="confirm">提交</button>
		</div>
	</div>
</template>

<script>
import mixin from "@/mixin"
import vFormItem from "./components/form-item.vue"
import vDivider from "../../components/divider/index.vue"
import vInput from "./components/input.vue"
import vSwitch from "./components/switch.vue"
import vCheckbox from "./components/checkbox.vue"
import vRadio from "./components/radio.vue"
import vSlider from "./components/slider.vue"
import vRate from "./components/rate.vue"
import vDatePicker from "./components/date-picker.vue"
import vNumberBox from "./components/number-box.vue"
import vColorPicker from "./components/color-picker.vue"
import vTimePicker from "./components/time-picker.vue"
import vSelect from "./components/select.vue"
import vCascadeSelect from "./components/cascade-select.vue"
import vUpload from "./components/upload/upload.vue"
import vRegion from "./components/region.vue"
import vGetCode from "./components/getCode.vue"

export default {
	name: "forms",
	mixins: [mixin],
	data() {
		return {
			forms: {
				fields: [
					{
						__config__: {
							label: "分割线",
							showLabel: true,
							changeTag: true,
							tag: "el-divider",
							tagIcon: "el-icon-minus",
							layout: "colFormItem",
							span: 24,
							document: "https://element.eleme.cn/#/zh-CN/component/divider",
							regList: [],
							position: "center",
							formId: 124,
							renderKey: "1011695782466989",
						},
						style: {
							width: "100%",
						},
						__vModel__: "field124",
					},
					{
						__config__: {
							label: "纯文本",
							showLabel: true,
							changeTag: true,
							tag: "span",
							tagIcon: "el-icon-document",
							defaultValue: "显示内容",
							layout: "colFormItem",
							span: 24,
							document: "https://element.eleme.cn/#/zh-CN/component/divider",
							regList: [],
							itemClass: "font-size: 14px;color: #606266;",
							formId: 101,
							renderKey: "1011695180614857",
						},
						style: {
							width: "100%",
						},
						__vModel__: "field101",
					},
					{
						__config__: {
							label: "单行文本",
							labelWidth: null,
							showLabel: true,
							changeTag: true,
							tag: "el-input",
							tagIcon: "el-icon-edit",
							defaultValue: "root",
							required: true,
							layout: "colFormItem",
							span: 24,
							document: "https://element.eleme.cn/#/zh-CN/component/input",
							regList: [],
							regList2: {
								id: null,
								pattern: null,
								message: "",
							},
							formId: 102,
							renderKey: "1021695180631116",
						},
						__slot__: {
							prepend: "",
							append: "",
						},
						placeholder: "请输入单行文本",
						style: {
							width: "100%",
						},
						clearable: true,
						"prefix-icon": "",
						"suffix-icon": "",
						maxlength: null,
						"show-word-limit": false,
						readonly: false,
						disabled: false,
						__vModel__: "field102",
					},
					{
						__config__: {
							label: "多行文本",
							labelWidth: null,
							showLabel: true,
							tag: "el-input",
							tagIcon: "el-icon-tickets",
							required: true,
							layout: "colFormItem",
							span: 24,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/input",
							formId: 103,
							renderKey: "1031695180632402",
							defaultValue: "",
						},
						type: "textarea",
						placeholder: "请输入多行文本",
						autosize: {
							minRows: 4,
							maxRows: 4,
						},
						style: {
							width: "100%",
						},
						maxlength: 120,
						"show-word-limit": true,
						readonly: false,
						disabled: false,
						__vModel__: "field103",
					},
					{
						__config__: {
							label: "密码",
							showLabel: true,
							labelWidth: null,
							changeTag: true,
							tag: "el-input",
							tagIcon: "el-icon-view",
							defaultValue: "root@123",
							layout: "colFormItem",
							span: 24,
							required: true,
							regList: [],
							document: "https://element.eleme.cn/#/zh-CN/component/input",
							formId: 104,
							renderKey: "1041695180635168",
						},
						__slot__: {
							prepend: "",
							append: "",
						},
						placeholder: "请输入密码",
						"show-password": true,
						style: {
							width: "100%",
						},
						clearable: true,
						"prefix-icon": "",
						"suffix-icon": "",
						maxlength: null,
						"show-word-limit": false,
						readonly: false,
						disabled: false,
						__vModel__: "field104",
					},
					{
						__config__: {
							label: "计数器",
							showLabel: true,
							changeTag: true,
							labelWidth: null,
							tag: "el-input-number",
							tagIcon: "el-icon-c-scale-to-original",
							span: 24,
							layout: "colFormItem",
							required: true,
							regList: [],
							document: "https://element.eleme.cn/#/zh-CN/component/input-number",
							formId: 105,
							renderKey: "1051695884246891",
						},
						placeholder: "计数器",
						min: 0,
						step: 0.2,
						"step-strictly": true,
						precision: 1,
						"controls-position": "",
						disabled: false,
						__vModel__: "field105",
					},
					{
						__config__: {
							label: "下拉选择",
							showLabel: true,
							labelWidth: null,
							tag: "el-select",
							tagIcon: "el-icon-arrow-down",
							layout: "colFormItem",
							span: 24,
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/select",
							formId: 107,
							renderKey: "1071695180645112",
							defaultValue: 1,
						},
						__slot__: {
							options: [
								{
									label: "选项一",
									value: 1,
								},
								{
									label: "选项二",
									value: 2,
								},
								{
									label: "选项3",
									value: 3,
								},
								{
									label: "选项4",
									value: 4,
								},
								{
									label: "选项5",
									value: 5,
								},
								{
									label: "选项6",
									value: 6,
								},
								{
									label: "选项7",
									value: 7,
								},
								{
									label: "选项8",
									value: 8,
								},
								{
									label: "选项9",
									value: 9,
								},
								{
									label: "选项10",
									value: 10,
								},
							],
						},
						placeholder: "请选择下拉选择",
						style: {
							width: "100%",
						},
						clearable: true,
						disabled: false,
						filterable: false,
						multiple: false,
						__vModel__: "field107",
					},
					{
						__config__: {
							label: "级联选择",
							url: "https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/cascaderList",
							method: "get",
							dataPath: "list",
							dataConsumer: "options",
							showLabel: true,
							labelWidth: null,
							tag: "el-cascader",
							tagIcon: "el-icon-connection",
							layout: "colFormItem",
							defaultValue: [],
							dataType: "static",
							span: 24,
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/cascader",
							formId: 108,
							renderKey: "1081695180647194",
						},
						options: [
							{
								id: 1,
								value: "1",
								label: "选项1",
								children: [
									{
										id: 2,
										value: "2",
										label: "选项1-1",
									},
								],
							},
						],
						placeholder: "请选择级联选择",
						style: {
							width: "100%",
						},
						props: {
							props: {
								multiple: false,
								label: "label",
								value: "value",
								children: "children",
							},
						},
						"show-all-levels": true,
						disabled: false,
						clearable: true,
						filterable: false,
						separator: "/",
						__vModel__: "field108",
					},
					{
						__config__: {
							label: "单选框组",
							labelWidth: null,
							showLabel: true,
							tag: "el-radio-group",
							tagIcon: "el-icon-remove-outline",
							changeTag: true,
							layout: "colFormItem",
							span: 24,
							defaultValue: 2,
							optionType: "button",
							regList: [],
							required: true,
							border: false,
							document: "https://element.eleme.cn/#/zh-CN/component/radio",
							formId: 109,
							renderKey: "1091695180648993",
						},
						__slot__: {
							options: [
								{
									label: "选项一",
									value: 1,
								},
								{
									label: "选项二",
									value: 2,
								},
								{
									label: "选项三",
									value: "3",
								},
							],
						},
						style: {},
						size: "medium",
						disabled: false,
						__vModel__: "field109",
					},
					{
						__config__: {
							label: "多选框组",
							tag: "el-checkbox-group",
							tagIcon: "el-icon-circle-plus-outline",
							defaultValue: [1, 2],
							span: 24,
							showLabel: true,
							labelWidth: null,
							layout: "colFormItem",
							optionType: "button",
							required: true,
							regList: [],
							changeTag: true,
							border: false,
							document: "https://element.eleme.cn/#/zh-CN/component/checkbox",
							formId: 110,
							renderKey: "1101695180650617",
						},
						__slot__: {
							options: [
								{
									label: "选项一",
									value: 1,
								},
								{
									label: "选项二",
									value: 2,
								},
								{
									label: "选项二",
									value: "3",
								},
							],
						},
						style: {},
						size: "medium",
						disabled: false,
						__vModel__: "field110",
					},
					{
						__config__: {
							label: "开关",
							tag: "el-switch",
							tagIcon: "el-icon-open",
							defaultValue: false,
							span: 24,
							showLabel: true,
							labelWidth: null,
							layout: "colFormItem",
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/switch",
							formId: 111,
							renderKey: "1111695180652521",
						},
						style: {},
						disabled: false,
						"active-text": "",
						"inactive-text": "",
						"active-color": "#ec186e",
						"inactive-color": "#b891f6",
						"active-value": true,
						"inactive-value": false,
						__vModel__: "field111",
					},
					{
						__config__: {
							label: "滑块",
							tag: "el-slider",
							tagIcon: "el-icon-turn-off",
							defaultValue: 20,
							span: 24,
							showLabel: true,
							layout: "colFormItem",
							labelWidth: null,
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/slider",
							formId: 112,
							renderKey: "1121695180654089",
						},
						disabled: false,
						min: 0,
						max: 100,
						step: 1,
						"show-stops": false,
						range: false,
						__vModel__: "field112",
					},
					{
						__config__: {
							label: "时间选择",
							tag: "el-time-picker",
							tagIcon: "el-icon-time",
							defaultValue: null,
							span: 24,
							showLabel: true,
							layout: "colFormItem",
							labelWidth: null,
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/time-picker",
							formId: 113,
							renderKey: "1131695180656689",
						},
						placeholder: "请选择时间选择",
						style: {
							width: "100%",
						},
						disabled: false,
						clearable: true,
						"picker-options": {
							selectableRange: "00:00-23:59:59",
						},
						format: "HH:mm:ss",
						"value-format": "HH:mm:ss",
						__vModel__: "field113",
					},
					{
						__config__: {
							label: "时间范围",
							tag: "el-time-picker",
							tagIcon: "el-icon-time",
							span: 24,
							showLabel: true,
							labelWidth: null,
							layout: "colFormItem",
							defaultValue: null,
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/time-picker",
							formId: 114,
							renderKey: "1141695180661089",
						},
						style: {
							width: "100%",
						},
						disabled: false,
						clearable: true,
						"is-range": true,
						"range-separator": "-",
						"start-placeholder": "开始时间",
						"end-placeholder": "结束时间",
						format: "HH:mm:ss",
						"value-format": "HH:mm:ss",
						__vModel__: "field114",
					},
					{
						__config__: {
							label: "日期选择",
							tag: "el-date-picker",
							tagIcon: "el-icon-date",
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							span: 24,
							layout: "colFormItem",
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/date-picker",
							formId: 115,
							renderKey: "1151695180663921",
						},
						placeholder: "请选择日期选择",
						type: "year",
						style: {
							width: "100%",
						},
						disabled: false,
						clearable: true,
						format: "yyyy-MM-dd",
						"value-format": "yyyy-MM-dd",
						readonly: false,
						__vModel__: "field115",
					},
					{
						__config__: {
							label: "日期范围",
							tag: "el-date-picker",
							tagIcon: "el-icon-date",
							defaultValue: null,
							span: 24,
							showLabel: true,
							labelWidth: null,
							required: true,
							layout: "colFormItem",
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/date-picker",
							formId: 116,
							renderKey: "1161695180668273",
						},
						style: {
							width: "100%",
						},
						type: "datetimerange",
						"range-separator": "至",
						"start-placeholder": "开始日期",
						"end-placeholder": "结束日期",
						disabled: false,
						clearable: true,
						format: "yyyy",
						"value-format": "yyyy",
						readonly: false,
						__vModel__: "field116",
					},
					{
						__config__: {
							label: "评分",
							tag: "el-rate",
							tagIcon: "el-icon-star-off",
							defaultValue: 0,
							span: 24,
							showLabel: true,
							labelWidth: null,
							layout: "colFormItem",
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/rate",
							formId: 117,
							renderKey: "1171695180678488",
						},
						style: {},
						max: 5,
						"allow-half": true,
						"show-text": true,
						"show-score": true,
						disabled: false,
						__vModel__: "field117",
					},
					{
						__config__: {
							label: "颜色选择",
							tag: "el-color-picker",
							tagIcon: "el-icon-brush",
							span: 24,
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							layout: "colFormItem",
							required: true,
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/color-picker",
							formId: 118,
							renderKey: "1181695180682161",
						},
						"show-alpha": true,
						"color-format": "rgb",
						disabled: false,
						size: "mini",
						__vModel__: "field118",
					},
					{
						__config__: {
							label: "图片上传",
							tag: "image-upload",
							tagIcon: "el-icon-picture-outline",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							required: true,
							span: 24,
							showTip: true,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							fileSize: 2,
							sizeUnit: "MB",
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							limit: 2,
							formId: 119,
							renderKey: "1191695180687376",
						},
						__slot__: {
							"list-type": true,
						},
						action: "https://jsonplaceholder.typicode.com/posts/",
						disabled: false,
						accept: "video/*",
						name: "file",
						"auto-upload": true,
						"list-type": "text",
						multiple: false,
						__vModel__: "field119",
					},
					{
						__config__: {
							label: "文件上传",
							tag: "file-upload",
							tagIcon: "el-icon-paperclip",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							required: true,
							span: 24,
							showTip: false,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							fileSize: 2,
							sizeUnit: "MB",
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							limit: 5,
							formId: 120,
							renderKey: "1201695180691536",
						},
						__slot__: {
							"list-type": true,
						},
						action: "https://jsonplaceholder.typicode.com/posts/",
						disabled: false,
						accept: "",
						name: "file",
						"auto-upload": true,
						"list-type": "text",
						multiple: false,
						__vModel__: "field120",
					},
					{
						__config__: {
							label: "视频上传",
							tag: "video-upload",
							tagIcon: "el-icon-video-camera",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							required: true,
							span: 24,
							showTip: false,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							fileSize: 2,
							sizeUnit: "MB",
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							formId: 121,
							renderKey: "1211695180695320",
						},
						__slot__: {
							"list-type": true,
						},
						action: "https://jsonplaceholder.typicode.com/posts/",
						disabled: false,
						accept: "",
						name: "file",
						"auto-upload": true,
						"list-type": "text",
						multiple: false,
						__vModel__: "field121",
					},
					{
						__config__: {
							label: "省市区",
							tag: "fortress-region",
							tagIcon: "el-icon-location-information",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							labelWidth: null,
							required: true,
							span: 24,
							showTip: false,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							fileSize: 2,
							sizeUnit: "MB",
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							formId: 122,
							renderKey: "1221695180701424",
						},
						__slot__: {
							"list-type": true,
						},
						placeholder: "请选择省市区",
						action: "https://jsonplaceholder.typicode.com/posts/",
						disabled: false,
						accept: "",
						name: "file",
						"auto-upload": true,
						"list-type": "text",
						multiple: false,
						__vModel__: "field122",
					},
					{
						__config__: {
							label: "手机号",
							tag: "phone_sms",
							tagIcon: "el-icon-mobile-phone",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							span: 24,
							buttonText: "点击上传",
							regList: [
								{
									pattern: "/^[1][3-9][0-9]{9}$/",
									message: "请输入正确的手机号",
								},
							],
							changeTag: true,
							sizeUnit: "MB",
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							isUnique: false,
							intervalSecond: 60,
							validityMinute: 5,
							formId: 123,
							renderKey: "1231695180708968",
						},
						__slot__: {
							"list-type": true,
						},
						placeholder: "请填写正确的手机号",
						action: "https://jsonplaceholder.typicode.com/posts/",
						"list-type": "text",
						multiple: false,
						__vModel__: "phone_sms",
					},
					{
						__config__: {
							label: "创建人",
							tag: "create_user",
							tagIcon: "el-icon-user",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							span: 24,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							formId: 125,
							renderKey: "1011697004263335",
						},
						__slot__: {
							"list-type": true,
						},
						action: "https://jsonplaceholder.typicode.com/posts/",
						"list-type": "text",
						__vModel__: "create_user",
					},
					{
						__config__: {
							label: "创建时间",
							tag: "create_time",
							tagIcon: "el-icon-date",
							layout: "colFormItem",
							defaultValue: null,
							showLabel: true,
							span: 24,
							buttonText: "点击上传",
							regList: [],
							changeTag: true,
							document: "https://element.eleme.cn/#/zh-CN/component/upload",
							formId: 126,
							renderKey: "1021697004264470",
						},
						__slot__: {
							"list-type": true,
						},
						action: "https://jsonplaceholder.typicode.com/posts/",
						"list-type": "text",
						__vModel__: "create_time",
					},
				],
				formRef: "elForm",
				formModel: "formData",
				size: "medium",
				labelPosition: "right",
				labelWidth: 100,
				formRules: "rules",
				gutter: 15,
				disabled: false,
				span: 24,
				formBtns: true,
			},
		}
	},
	computed: {},
	methods: {
		onUploadcardType(list) {
			console.log(list, "list")
			// this.formData.cardType = list
		},
		onUploadvideo(list) {
			console.log(list, "list")
		},
		onUploadfile(list) {
			console.log(list, "list")
		},
		cancel() {
			this.toPage(-1)
		},
		confirm() {
			// todo
		},
		changeCode(code) {
			console.log(code, "code")
			// this.code = code
		},
		// 获取时间
		getTime(time) {
			console.log(time, "196")
			// this.time = time
		},
	},
	components: {
		vFormItem,
		vDivider,
		vInput,
		vSwitch,
		vCheckbox,
		vRadio,
		vSlider,
		vRate,
		vDatePicker,
		vNumberBox,
		vColorPicker,
		vTimePicker,
		vSelect,
		vCascadeSelect,
		vUpload,
		vRegion,
		vGetCode,
	},
}
</script>

<style lang="scss" scoped>
.forms {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.footer {
	padding: 20rpx 40rpx;
	text-align: right;
	margin-top: 40rpx;
	.button {
		margin-left: 40rpx;
	}
}
</style>
